<template>
  <div>
      <v-title vtitle="EditorPage"></v-title>
      <vue-editor v-model="content"></vue-editor>
      <div class="html ql-editor" v-html="content"></div>
  </div>
</template>
<script>
import vTitle from '../common/PageTitle.vue';
import { VueEditor } from 'vue2-editor'
export default {
  components: {
    vTitle,VueEditor
  },
  data() {
      return{
          content:'<h2>我是liaofan</h2>'
      }
  }
}
</script>

<style scoped>
  .el-col{
        margin-bottom:16px;
    }
    .material-icons{
        font-size:80px;
        color:#ddd;
    }
   
     .ql-editor {
        min-height: 20em;
        padding-bottom: 1em;
        max-height: 25em;
        
    }
    .html {
        height: 9em;
        overflow-y: auto;
        border: 1px solid #ccc;
        border-top: none;
        background-color:#fff;
    }
</style>

